<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>团购首页</title>
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <!-- 头部 -->
    <header>
        <div class="h_top">
            <!-- LOGO -->
            <img src="./png/index/LOGO.png" alt="LOGO">

            <!-- 搜索框 -->
            <div class="inp">
                <input type="text" placeholder="请输入商品名称">
            </div>

            <!-- 地区 -->
            <div class="sel">
                <select>
                    <option value="">广州市</option>
                    <option value="">深圳市</option>
                    <option value="">北京市</option>
                </select>

                <!-- 三角形 -->
                <li></li>
            </div>
        </div>
        <!-- 轮播图 -->
        <div class="h_bt">
            <ul>
                <li>
                    <img src="./png/index/轮播图.png" alt="">
                </li>
                <li>
                    <img src="./png/index/轮播图.png" alt="">
                </li>
                <li>
                    <img src="./png/index/轮播图.png" alt="">
                </li>
            </ul>

            <div class="bar">
                <div></div>
            </div>
        </div>
    </header>

    <!-- 主要内容 -->
    <main>
        <!-- 优惠 -->
        <div class="groupbuying">
            <ul>
                <img src="./png/index/鍥㈣喘.png" alt="">
                <span>优惠团购 </span>
            </ul>

            <div>
                <a href=""><span> 更多</span></a>
                <img src="./png/index/更多.png" alt="">
            </div>
        </div>

        <div class="pag">

            <ul>
                <img src="./png/index/鍥惧眰5.png" alt="">

                <img src="./png/index/鍥惧眰6.png" alt="">
            </ul>
            <ul>
                <img src="./png/index/鍥惧眰7.png" alt="">

                <img src="./png/index/鍥惧眰8.png" alt="">
            </ul>

        </div>



        <!-- 喜欢 -->
        <div class="groupbuying">
            <ul>
                <img src="./png/index/鏀惰棌.png" alt="">
                <span>猜你喜欢 </span>
            </ul>

            <div>
                <span> <a href=""> 更多</a></span>
                <img src="./png/index/更多.png" alt="">
            </div>
        </div>


        <div class="bt">
            <a href="./product detail.html">
                <div class="box">
                    <img src="./png/index/鍥惧眰3.png" alt="">
                    <div class="box1">


                        <div class="tp">
                            <h4>万岁寿司（正佳店）</h4>
                            <span>&lt; 100m</span>
                        </div>

                        <div>
                            <p> [100店通用] 双人套餐</p>
                        </div>

                        <div class="tp">
                            <h3> ￥88.00</h3>
                            <span> 已售1000</span>
                        </div>

                    </div>

                </div>
            </a>

        </div>


        <div class="bt">
            <a href="">
                <div class="box">
                    <img src="./png/index/鍥惧眰4.png" alt="">
                    <div class="box1">

                        <div class="tp">
                            <h4>周黑鸭（正佳店）</h4>
                            <span>&lt; 100m</span>
                        </div>

                        <div>
                            <p> [100店通用] 双人套餐</p>
                        </div>

                        <div class="tp">
                            <h3> ￥88.00</h3>
                            <span> 已售1000</span>
                        </div>

                    </div>

                </div>
            </a>

        </div>

        <div class="bt">
            <a href="">
                <div class="box">
                    <img src="./png/index/鍥惧眰3.png" alt="">
                    <div class="box1">

                        <div class="tp">
                            <h4>万岁寿司（正佳店）</h4>
                            <span>&lt; 100m</span>
                        </div>

                        <div>
                            <p> [100店通用] 双人套餐</p>
                        </div>

                        <div class="tp">
                            <h3> ￥88.00</h3>
                            <span> 已售1000</span>
                        </div>

                    </div>

                </div>
            </a>

        </div>


        <div class="bt">
            <a href="">
                <div class="box">
                    <img src="./png/index/鍥惧眰4.png" alt="">
                    <div class="box1">

                        <div class="tp">
                            <h4>周黑鸭（正佳店）</h4>
                            <span>&lt; 100m</span>
                        </div>

                        <div>
                            <p> [100店通用] 双人套餐</p>
                        </div>

                        <div class="tp">
                            <h3> ￥88.00</h3>
                            <span> 已售1000</span>
                        </div>

                    </div>

                </div>
            </a>

        </div>


    </main>


    <!-- 尾部导航栏 -->
    <nav>
        <ul>
            <li>
                <a href="./index.html">
                    <img src="./png/index/棣栭〉.png" alt=""> </a>
                <P>首页</P>
            </li>

            <li>
                <a href="classification.html">
                    <img src="./png/index/鍒嗙被4.png" alt=""> </a>
                <p>分类</p>
            </li>


            <li>
                <a href="./find.html">
                    <img src="./png/index/鎸囬拡.png" alt=""> </a>
                <p>发现</p>
            </li>

            <li>
                <a href="./my.html">
                    <img src="./png/index/鎴戠殑.png" alt=""> </a>
                <p>我的</p>
            </li>
        </ul>

    </nav>
</body>

</html>